<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>系统配置</title>
    <% include("../../common/css.html"){} %>
</head>
<body>
<% include("../../layout/loading.html"){} %>

<!-- 正文开始 -->
<div class="layui-fluid">
    <div id="configBtn">
        <input type="hidden" id="appId" value="system">
        <div class="layui-card">
            <div class="layui-card-header">
                <span style="padding: 0 15px;"> 系统参数</span>
                <button type="button" id="addBtn" class="layui-btn layui-btn-sm"
                        style="position:absolute;right: 20px;margin-top:10px;">
                    <i class="layui-icon">&#xe654;</i> 新增参数
                </button>
            </div>
            <div class="layui-card-body">
                <div class="layui-form toolbar">
                    <div class="layui-form-item">
                        <div class="layui-inline">
                            <input id="configName" onchange="configNameChange()" class="layui-input" type="text"
                                   autocomplete="off" placeholder="参数名称/内容"/>
                        </div>
                        <div class="layui-inline">
                            <button id="btn-refresh" class="layui-btn layui-btn-primary">
                                <i class="layui-icon">&#xe669;</i>刷新
                            </button>
                        </div>
                    </div>
                </div>
                <table class="layui-table" id="configTable" lay-filter="configTable"></table>
            </div>
        </div>
    </div>

    <!-- 表格操作列 -->
    <script type="text/html" id="tableBar">
        <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="edit">修改</a>
        <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
    </script>

    <!-- js部分 -->
    <% include("../../common/js.html"){} %>
    <script>
        layui.use(['layer', 'form', 'table', 'admin', 'dropdown', 'element'], function () {
            var $ = layui.jquery;
            var layer = layui.layer;
            var form = layui.form;
            var table = layui.table;
            var admin = layui.admin;
            var element = layui.element;

            // 渲染表格
            var insTb = table.render({
                id: 'configTable',
                elem: '#configTable',
                url: '/system/config/listByAppId',
                page: true,
                cellMinWidth: 100,
                cols: [[
                    {field: 'appId', title: '模块', width: 150, align: 'center'},
                    {field: 'title', title: '参数名称', width: 230, align: 'center'},
                    {field: 'confKey', title: '参数键名', width: 220, align: 'center'},
                    {
                        field: 'confValue', title: '参数键值', minWidth: 300, templet: function (d) {
                            return "<span>" + d.confValue + "</span>";
                        }
                    },
                    {
                        templet: function (d) {
                            return d.updateTime ? d.updateTime : "";
                        }, title: '最后更新时间', width: 200, align: 'center'
                    },
                    {templet: '#tableBar', title: '操作', align: 'center', width: 200, fixed: 'right'}
                ]],
                where: {
                    appId: 'system'
                }
            });

            $('#btn-refresh').click(function () {
                insTb.reload();
            });

            window.configNameChange = function () {
                table.reload('configTable', {
                    page: {curr: 1},
                    where: {appId: $("#searchAppId").val(), configName: $("#configName").val()}
                });
            }

            // 工具条点击事件
            table.on('tool(configTable)', function (obj) {
                var data = obj.data;
                var layEvent = obj.event;
                if (layEvent === 'edit') { // 修改
                    showEditModel(data);
                } else if (layEvent === 'del') { // 删除
                    doDel(data.id);
                }
            });

            // 删除
            function doDel(id) {
                top.layer.confirm('确定要删除配置吗？', {
                    skin: 'layui-layer-admin'
                }, function (i) {
                    top.layer.close(i);
                    layer.load(2);
                    $.post('/system/config/delete', {
                        id: id
                    }, function (res) {
                        layer.closeAll('loading');
                        if (res.code == 200) {
                            layer.msg(res.msg, {icon: 1});
                            insTb.reload();
                        } else {
                            layer.msg(res.msg, {icon: 2});
                        }
                    }, 'json');
                });
            }


            // 显示表单弹窗
            function showEditModel(mAuth) {
                admin.open({
                    title: '修改系统参数',
                    type: 2,
                    shade: 0,
                    maxmin: true,
                    resize: true,
                    area: ['600px', '360px'],
                    content: ("/system/config/param/edit?id=" + mAuth.id)
                });
            }


            // 添加
            $('#addBtn').click(function () {
                admin.open({
                    title: '新增系统参数',
                    type: 2,
                    shade: 0,
                    maxmin: true,
                    resize: true,
                    area: ['600px', '360px'],
                    content: "/system/config/param/add?appId=" + $("#appId").val()
                });
            });


        });
    </script>

</body>
</html>